<!DOCTYPE html>
<html>
<head>
    <title>API测试页面</title>
    <meta charset="UTF-8">
</head>
<body>
    <h1>选择题目接口测试</h1>

    <div>
        <label>考试ID: <input type="number" id="examId" value="1"></label><br><br>
        <label>题目ID列表 (用逗号分隔): <input type="text" id="questionIds" value="123"></label><br><br>
        <button onclick="testAPI()">测试接口</button>
    </div>

    <div id="result" style="margin-top: 20px; padding: 10px; border: 1px solid #ccc;"></div>

    <script>
        async function testAPI() {
            const examId = parseInt(document.getElementById('examId').value);
            const questionIdsText = document.getElementById('questionIds').value;
            const questionIds = questionIdsText.split(',').map(id => parseInt(id.trim()));

            const requestData = {
                examId: examId,
                questionIds: questionIds
            };

            const resultDiv = document.getElementById('result');
            resultDiv.innerHTML = '请求中...';

            try {
                const response = await fetch('http://localhost:8080/exams/select-questions', {
                    method: 'POST',
                    headers: {
                        'Content-Type': 'application/json',
                    },
                    body: JSON.stringify(requestData)
                });

                const responseText = await response.text();

                resultDiv.innerHTML = `
                    <h3>响应结果:</h3>
                    <p><strong>状态码:</strong> ${response.status}</p>
                    <p><strong>响应内容:</strong> ${responseText}</p>
                    <p><strong>请求数据:</strong> ${JSON.stringify(requestData, null, 2)}</p>
                `;

                if (response.ok) {
                    resultDiv.style.backgroundColor = '#d4edda';
                    resultDiv.style.color = '#155724';
                } else {
                    resultDiv.style.backgroundColor = '#f8d7da';
                    resultDiv.style.color = '#721c24';
                }

            } catch (error) {
                resultDiv.innerHTML = `
                    <h3>请求失败:</h3>
                    <p><strong>错误:</strong> ${error.message}</p>
                `;
                resultDiv.style.backgroundColor = '#f8d7da';
                resultDiv.style.color = '#721c24';
            }
        }
    </script>
</body>
</html>
